<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Standard Meta -->
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Title -->
    <title>{% block title %}BLOG{% endblock %}</title>

    <!-- Google Font -->
    <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Raleway:200,300,400"/>

    <!-- CSS Files -->
    <link href="{{ url_for('static', filename='css/semantic.css') }}" rel="stylesheet">
    <link href="{{ url_for('static', filename='css/styles.css') }}" rel="stylesheet">

    <!-- JS Files -->
    <script src="{{ url_for('static', filename='js/semantic.js') }}"></script>
    <script src="{{ url_for('static', filename='js/jquery-3.4.1.min.js') }}"></script>

    {#  分页宏  #}
    {% macro render_pagination(pagination, endpoint) %}
        <nav>
            <ul class="pagination">
                <li>
                    <a href="{{ url_for('blog.home', page=pagination.prev().page) }}" aria-label="Previous">
                        <span aria-hidden="true">&laquo;</span>
                    </a>
                </li>
                {% for page in pagination.iter_pages() %}
                    {% if page %}
                        {% if page != pagination.page %}
                            <li>
                                <a href="{{ url_for(endpoint, page=page) }}">{{ page }}</a>
                            </li>
                        {% else %}
                            <li>
                                <a href="">{{ page }}</a>
                            </li>
                        {% endif %}
                    {% else %}
                        <li>
                            <a>...</a>
                        </li>
                    {% endif %}
                {% endfor %}
                <li>
                    <a href="{{ url_for('blog.home', page=pagination.next().page) }}" aria-label="Next">
                        <span aria-hidden="true">&raquo;</span>
                    </a>
                </li>
            </ul>
        </nav>
    {% endmacro %}
</head>
<body>

<!-- Page Contents -->
<div class="pusher">
    <div class="ui vertical sc-main center aligned segment">
        <div class="ui container">
            <div class="ui large secondary inverted pointing fixed menu">
                <a class="toc item">
                    <i class="sidebar icon"></i>
                </a>
                <div class="sc-logo">SC</div>
                <div class="right item">
                    <a class="item" href="{{ url_for('blog.home') }}">Home</a>
                    <a class="item" href="">Services</a>
                    <a class="item" href="">Portfolio</a>
                    <a class="item" href="">About</a>
                    <a class="item" href="">Team</a>
                    <a class="item" href="">Contact</a>
                </div>
            </div>
            <div class="ui text sc-header-content container">
                <h1 class="ui inverted header">BE SEMANTIC</h1>
                <p class="ui inverted header">Excepteur sint occaecat cupidatat non proident, sunt in culpa quiofficia
                    deserunt mollit anim id est laborum.</p>
                <a class="ui huge primary right labeled icon button sc-button">GET STARTED<i class="home icon"></i></a>
            </div>
        </div>
    </div>
</div>

<div class="ui container">
    {% block body %}{% endblock %}
    {#    <div class="jumbotron">#}
    {#        <h1><a href="{{ url_for('blog.home') }}">My Blog</a></h1>#}
    {#        <p>Welcome to the Blog!</p>#}
    {#        {% block body %}{% endblock %}#}
    {#    </div>#}
</div>

<script src="{{ url_for('static', filename='js/script.js') }}"></script>
</body>
</html>